<template>
  <el-form :model="form4" label-width="auto" style="max-width: 1300px;min-width: 1300px">
    <div class="common-layout">
      <el-container>
        <el-main>
          <!--标题-->
          <el-row class="report-header">
            <el-col :span="24">
              <div class="grid-content ep-bg-purple-dark"/>
              <div class="title-container">
              <h1 style="font-size: 40px" class="the_font_is_bold">
                严损及质量判断
              </h1>
              </div>
            </el-col>
          </el-row>
          <!--质量严损判断人员-->
          <el-row>
            <el-col :span="4" style="padding-left: 10px;">
              <div class="grid-content ep-bg-purple"/>
              <span class="fontSize the_font_is_bold">质量严损判断人员</span>
            </el-col>
            <el-col :span="8">
              <span>{{form4.input_Judging_people}}</span>
            </el-col>
            <el-col :span="4" style="padding-left: 10px;">
              <div class="grid-content ep-bg-purple"/>
              <span class="fontSize the_font_is_bold">质量严损判断日期</span>
            </el-col>
            <el-col :span="8">
              <span>{{form4.input_Date}}</span>
            </el-col>
          </el-row>
          <!--Case-->
          <el-row>
            <el-col :span="2" style="padding-left: 10px;">
              <div class="grid-content ep-bg-purple"/>
              <span class="fontSize the_font_is_bold">Case</span>
            </el-col>
            <el-col :span="22">
              <span>{{form4.input_Case}}</span>
            </el-col>
          </el-row>
          <!--严损零件-->
          <el-row>
            <el-col :span="2" style="padding-left: 10px;">
              <div class="grid-content ep-bg-purple"/>
              <div
                  style="height:240px;display: flex;align-items: center; /* 垂直居中 */justify-content: center; /* 水平居中 */">
                <span class="text_is_vertical fontSize the_font_is_bold" >
                  严&nbsp;损&nbsp;零&nbsp;件
                </span>
              </div>
            </el-col>
            <el-col :span="22">
              <div class="grid-content ep-bg-purple"/>
              <el-row>
                <el-col :span="4">
                  <div class="grid-content ep-bg-purple"/>
                  <span class="the_font_is_bold">零件名称</span>
                </el-col>
                <el-col :span="2">
                  <div class="grid-content ep-bg-purple"/>
                  <span class="the_font_is_bold">损坏现象</span>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <span class="the_font_is_bold">处理方式</span>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <span class="the_font_is_bold">是否补齐</span>
                </el-col>
                <el-col :span="4">
                  <div class="grid-content ep-bg-purple"/>
                  <span class="the_font_is_bold">零件名称</span>
                </el-col>
                <el-col :span="2">
                  <div class="grid-content ep-bg-purple"/>
                  <span class="the_font_is_bold">损坏现象</span>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <span class="the_font_is_bold">处理方式</span>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <span class="the_font_is_bold">是否补齐</span>
                </el-col>
              </el-row>
              <!-- 1-2 -->
              <el-row>
                <el-col :span="4">
                  <div class="grid-content ep-bg-purple"/>
                  <!--零件名称 - 1-->
                  <span>{{form4.input_Part_name_1}}</span>
                </el-col>
                <el-col :span="2">
                  <div class="grid-content ep-bg-purple"/>
                  <!--损坏现象 - 1-->
                  <span>{{form4.input_Damage_1}}</span>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--处理方式 - 1-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Processing_1">
                      <el-radio value="更换" size="large" class="smallOptions"><span style="font-size: 15px;">更换</span>
                      </el-radio>
                      <el-radio value="维修" size="large" class="smallOptions"><span style="font-size: 15px;">维修</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--是否补齐 - 1-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Completion_1">
                      <el-radio value="是" size="large" class="smallOptions"><span style="font-size: 15px;">是</span>
                      </el-radio>
                      <el-radio value="否" size="large" class="smallOptions"><span style="font-size: 15px;">否</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="4">
                  <div class="grid-content ep-bg-purple"/>
                  <!--零件名称 - 2-->
                  <span>{{form4.input_Part_name_2}}</span>
                </el-col>
                <el-col :span="2">
                  <div class="grid-content ep-bg-purple"/>
                  <!--损坏现象 - 2-->
                  <span>{{form4.input_Damage_2}}</span>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--处理方式 - 2-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Processing_2">
                      <el-radio value="更换" size="large" class="smallOptions"><span style="font-size: 15px;">更换</span>
                      </el-radio>
                      <el-radio value="维修" size="large" class="smallOptions"><span style="font-size: 15px;">维修</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--是否补齐 - 2-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Completion_2">
                      <el-radio value="是" size="large" class="smallOptions"><span style="font-size: 15px;">是</span>
                      </el-radio>
                      <el-radio value="否" size="large" class="smallOptions"><span style="font-size: 15px;">否</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
              </el-row>
              <!-- 3-4 -->
              <el-row>
                <el-col :span="4">
                  <div class="grid-content ep-bg-purple"/>
                  <!--零件名称 - 3-->
                  <span>{{form4.input_Part_name_3}}</span>
                </el-col>
                <el-col :span="2">
                  <div class="grid-content ep-bg-purple"/>
                  <!--损坏现象 - 3-->
                  <span>{{form4.input_Damage_3}}</span>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--处理方式 - 3-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Processing_3">
                      <el-radio value="更换" size="large" class="smallOptions"><span style="font-size: 15px;">更换</span>
                      </el-radio>
                      <el-radio value="维修" size="large" class="smallOptions"><span style="font-size: 15px;">维修</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--是否补齐 - 3-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Completion_3">
                      <el-radio value="是" size="large" class="smallOptions"><span style="font-size: 15px;">是</span>
                      </el-radio>
                      <el-radio value="否" size="large" class="smallOptions"><span style="font-size: 15px;">否</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="4">
                  <div class="grid-content ep-bg-purple"/>
                  <!--零件名称 - 4-->
                  <span>{{form4.input_Part_name_4}}</span>
                </el-col>
                <el-col :span="2">
                  <div class="grid-content ep-bg-purple"/>
                  <!--损坏现象 - 4-->
                  <span>{{form4.input_Damage_4}}</span>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--处理方式 - 4-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Processing_4">
                      <el-radio value="更换" size="large" class="smallOptions"><span style="font-size: 15px;">更换</span>
                      </el-radio>
                      <el-radio value="维修" size="large" class="smallOptions"><span style="font-size: 15px;">维修</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--是否补齐 - 4-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Completion_4">
                      <el-radio value="是" size="large" class="smallOptions"><span style="font-size: 15px;">是</span>
                      </el-radio>
                      <el-radio value="否" size="large" class="smallOptions"><span style="font-size: 15px;">否</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
              </el-row>
              <!-- 5-6 -->
              <el-row>
                <el-col :span="4">
                  <div class="grid-content ep-bg-purple"/>
                  <!--零件名称 - 5-->
                  <span>{{form4.input_Part_name_5}}</span>
                </el-col>
                <el-col :span="2">
                  <div class="grid-content ep-bg-purple"/>
                  <!--损坏现象 - 5-->
                  <span>{{form4.input_Damage_5}}</span>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--处理方式 - 5-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Processing_5">
                      <el-radio value="更换" size="large" class="smallOptions"><span style="font-size: 15px;">更换</span>
                      </el-radio>
                      <el-radio value="维修" size="large" class="smallOptions"><span style="font-size: 15px;">维修</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--是否补齐 - 5-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Completion_5">
                      <el-radio value="是" size="large" class="smallOptions"><span style="font-size: 15px;">是</span>
                      </el-radio>
                      <el-radio value="否" size="large" class="smallOptions"><span style="font-size: 15px;">否</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="4">
                  <div class="grid-content ep-bg-purple"/>
                  <!--零件名称 - 6-->
                  <span>{{form4.input_Part_name_6}}</span>
                </el-col>
                <el-col :span="2">
                  <div class="grid-content ep-bg-purple"/>
                  <!--损坏现象 - 6-->
                  <span>{{form4.input_Damage_6}}</span>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--处理方式 - 6-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Processing_6">
                      <el-radio value="更换" size="large" class="smallOptions"><span style="font-size: 15px;">更换</span>
                      </el-radio>
                      <el-radio value="维修" size="large" class="smallOptions"><span style="font-size: 15px;">维修</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--是否补齐 - 6-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Completion_6">
                      <el-radio value="是" size="large" class="smallOptions"><span style="font-size: 15px;">是</span>
                      </el-radio>
                      <el-radio value="否" size="large" class="smallOptions"><span style="font-size: 15px;">否</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
              </el-row>
              <!-- 7-8 -->
              <el-row>
                <el-col :span="4">
                  <div class="grid-content ep-bg-purple"/>
                  <!--零件名称 - 7-->
                  <span>{{form4.input_Part_name_7}}</span>
                </el-col>
                <el-col :span="2">
                  <div class="grid-content ep-bg-purple"/>
                  <!--损坏现象 - 7-->
                  <span>{{form4.input_Damage_7}}</span>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--处理方式 - 7-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Processing_7">
                      <el-radio value="更换" size="large" class="smallOptions"><span style="font-size: 15px;">更换</span>
                      </el-radio>
                      <el-radio value="维修" size="large" class="smallOptions"><span style="font-size: 15px;">维修</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--是否补齐 - 7-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Completion_7">
                      <el-radio value="是" size="large" class="smallOptions"><span style="font-size: 15px;">是</span>
                      </el-radio>
                      <el-radio value="否" size="large" class="smallOptions"><span style="font-size: 15px;">否</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="4">
                  <div class="grid-content ep-bg-purple"/>
                  <!--零件名称 - 8-->
                  <span>{{form4.input_Part_name_8}}</span>
                </el-col>
                <el-col :span="2">
                  <div class="grid-content ep-bg-purple"/>
                  <!--损坏现象 - 8-->
                  <span>{{form4.input_Damage_8}}</span>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--处理方式 - 8-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Processing_8">
                      <el-radio value="更换" size="large" class="smallOptions"><span style="font-size: 15px;">更换</span>
                      </el-radio>
                      <el-radio value="维修" size="large" class="smallOptions"><span style="font-size: 15px;">维修</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--是否补齐 - 8-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Completion_8">
                      <el-radio value="是" size="large" class="smallOptions"><span style="font-size: 15px;">是</span>
                      </el-radio>
                      <el-radio value="否" size="large" class="smallOptions"><span style="font-size: 15px;">否</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
              </el-row>
              <!-- 9-10 -->
              <el-row>
                <el-col :span="4">
                  <div class="grid-content ep-bg-purple"/>
                  <!--零件名称 - 9-->
                  <span>{{form4.input_Part_name_9}}</span>
                </el-col>
                <el-col :span="2">
                  <div class="grid-content ep-bg-purple"/>
                  <!--损坏现象 - 9-->
                  <span>{{form4.input_Damage_9}}</span>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--处理方式 - 9-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Processing_9">
                      <el-radio value="更换" size="large" class="smallOptions"><span style="font-size: 15px;">更换</span>
                      </el-radio>
                      <el-radio value="维修" size="large" class="smallOptions"><span style="font-size: 15px;">维修</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--是否补齐 - 9-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Completion_9">
                      <el-radio value="是" size="large" class="smallOptions"><span style="font-size: 15px;">是</span>
                      </el-radio>
                      <el-radio value="否" size="large" class="smallOptions"><span style="font-size: 15px;">否</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="4">
                  <div class="grid-content ep-bg-purple"/>
                  <!--零件名称 - 10-->
                  <span>{{form4.input_Part_name_10}}</span>
                </el-col>
                <el-col :span="2">
                  <div class="grid-content ep-bg-purple"/>
                  <!--损坏现象 - 10-->
                  <span>{{form4.input_Damage_10}}</span>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--处理方式 - 10-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Processing_10">
                      <el-radio value="更换" size="large" class="smallOptions"><span style="font-size: 15px;">更换</span>
                      </el-radio>
                      <el-radio value="维修" size="large" class="smallOptions"><span style="font-size: 15px;">维修</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--是否补齐 - 10-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Completion_10">
                      <el-radio value="是" size="large" class="smallOptions"><span style="font-size: 15px;">是</span>
                      </el-radio>
                      <el-radio value="否" size="large" class="smallOptions"><span style="font-size: 15px;">否</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
              </el-row>
              <!-- 11-12 -->
              <el-row>
                <el-col :span="4">
                  <div class="grid-content ep-bg-purple"/>
                  <!--零件名称 - 11-->
                  <span>{{form4.input_Part_name_11}}</span>
                </el-col>
                <el-col :span="2">
                  <div class="grid-content ep-bg-purple"/>
                  <!--损坏现象 - 11-->
                  <span>{{form4.input_Damage_11}}</span>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--处理方式 - 11-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Processing_11">
                      <el-radio value="更换" size="large" class="smallOptions"><span style="font-size: 15px;">更换</span>
                      </el-radio>
                      <el-radio value="维修" size="large" class="smallOptions"><span style="font-size: 15px;">维修</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--是否补齐 - 11-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Completion_11">
                      <el-radio value="是" size="large" class="smallOptions"><span style="font-size: 15px;">是</span>
                      </el-radio>
                      <el-radio value="否" size="large" class="smallOptions"><span style="font-size: 15px;">否</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="4">
                  <div class="grid-content ep-bg-purple"/>
                  <!--零件名称 - 12-->
                  <span>{{form4.input_Part_name_12}}</span>
                </el-col>
                <el-col :span="2">
                  <div class="grid-content ep-bg-purple"/>
                  <!--损坏现象 - 12-->
                  <span>{{form4.input_Damage_12}}</span>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--处理方式 - 12-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Processing_12">
                      <el-radio value="更换" size="large" class="smallOptions"><span style="font-size: 15px;">更换</span>
                      </el-radio>
                      <el-radio value="维修" size="large" class="smallOptions"><span style="font-size: 15px;">维修</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--是否补齐 - 12-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Completion_12">
                      <el-radio value="是" size="large" class="smallOptions"><span style="font-size: 15px;">是</span>
                      </el-radio>
                      <el-radio value="否" size="large" class="smallOptions"><span style="font-size: 15px;">否</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
              </el-row>
              <!-- 13-14 -->
              <el-row>
                <el-col :span="4">
                  <div class="grid-content ep-bg-purple"/>
                  <!--零件名称 - 13-->
                  <span>{{form4.input_Part_name_13}}</span>
                </el-col>
                <el-col :span="2">
                  <div class="grid-content ep-bg-purple"/>
                  <!--损坏现象 - 13-->
                  <span>{{form4.input_Damage_13}}</span>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--处理方式 - 13-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Processing_13">
                      <el-radio value="更换" size="large" class="smallOptions"><span style="font-size: 15px;">更换</span>
                      </el-radio>
                      <el-radio value="维修" size="large" class="smallOptions"><span style="font-size: 15px;">维修</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--是否补齐 - 13-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Completion_13">
                      <el-radio value="是" size="large" class="smallOptions"><span style="font-size: 15px;">是</span>
                      </el-radio>
                      <el-radio value="否" size="large" class="smallOptions"><span style="font-size: 15px;">否</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="4">
                  <div class="grid-content ep-bg-purple"/>
                  <!--零件名称 - 14-->
                  <span>{{form4.input_Part_name_14}}</span>
                </el-col>
                <el-col :span="2">
                  <div class="grid-content ep-bg-purple"/>
                  <!--损坏现象 - 14-->
                  <span>{{form4.input_Damage_14}}</span>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--处理方式 - 14-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Processing_14">
                      <el-radio value="更换" size="large" class="smallOptions"><span style="font-size: 15px;">更换</span>
                      </el-radio>
                      <el-radio value="维修" size="large" class="smallOptions"><span style="font-size: 15px;">维修</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--是否补齐 - 14-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Completion_14">
                      <el-radio value="是" size="large" class="smallOptions"><span style="font-size: 15px;">是</span>
                      </el-radio>
                      <el-radio value="否" size="large" class="smallOptions"><span style="font-size: 15px;">否</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
              </el-row>
              <!-- 15-16 -->
              <el-row>
                <el-col :span="4">
                  <div class="grid-content ep-bg-purple"/>
                  <!--零件名称 - 15-->
                  <span>{{form4.input_Part_name_15}}</span>
                </el-col>
                <el-col :span="2">
                  <div class="grid-content ep-bg-purple"/>
                  <!--损坏现象 - 15-->
                  <span>{{form4.input_Damage_15}}</span>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--处理方式 - 15-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Processing_15">
                      <el-radio value="更换" size="large" class="smallOptions"><span style="font-size: 15px;">更换</span>
                      </el-radio>
                      <el-radio value="维修" size="large" class="smallOptions"><span style="font-size: 15px;">维修</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--是否补齐 - 15-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Completion_15">
                      <el-radio value="是" size="large" class="smallOptions"><span style="font-size: 15px;">是</span>
                      </el-radio>
                      <el-radio value="否" size="large" class="smallOptions"><span style="font-size: 15px;">否</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="4">
                  <div class="grid-content ep-bg-purple"/>
                  <!--零件名称 - 16-->
                  <span>{{form4.input_Part_name_16}}</span>
                </el-col>
                <el-col :span="2">
                  <div class="grid-content ep-bg-purple"/>
                  <!--损坏现象 - 16-->
                  <span>{{form4.input_Damage_16}}</span>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--处理方式 - 16-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Processing_16">
                      <el-radio value="更换" size="large" class="smallOptions"><span style="font-size: 15px;">更换</span>
                      </el-radio>
                      <el-radio value="维修" size="large" class="smallOptions"><span style="font-size: 15px;">维修</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--是否补齐 - 16-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Completion_16">
                      <el-radio value="是" size="large" class="smallOptions"><span style="font-size: 15px;">是</span>
                      </el-radio>
                      <el-radio value="否" size="large" class="smallOptions"><span style="font-size: 15px;">否</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
              </el-row>
              <!-- 17-18 -->
              <el-row>
                <el-col :span="4">
                  <div class="grid-content ep-bg-purple"/>
                  <!--零件名称 - 17-->
                  <span>{{form4.input_Part_name_17}}</span>
                </el-col>
                <el-col :span="2">
                  <div class="grid-content ep-bg-purple"/>
                  <!--损坏现象 - 17-->
                  <span>{{form4.input_Damage_17}}</span>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--处理方式 - 17-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Processing_17">
                      <el-radio value="更换" size="large" class="smallOptions"><span style="font-size: 15px;">更换</span>
                      </el-radio>
                      <el-radio value="维修" size="large" class="smallOptions"><span style="font-size: 15px;">维修</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--是否补齐 - 17-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Completion_17">
                      <el-radio value="是" size="large" class="smallOptions"><span style="font-size: 15px;">是</span>
                      </el-radio>
                      <el-radio value="否" size="large" class="smallOptions"><span style="font-size: 15px;">否</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="4">
                  <div class="grid-content ep-bg-purple"/>
                  <!--零件名称 - 18-->
                  <span>{{form4.input_Part_name_18}}</span>
                </el-col>
                <el-col :span="2">
                  <div class="grid-content ep-bg-purple"/>
                  <!--损坏现象 - 18-->
                  <span>{{form4.input_Damage_18}}</span>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--处理方式 - 18-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Processing_18">
                      <el-radio value="更换" size="large" class="smallOptions"><span style="font-size: 15px;">更换</span>
                      </el-radio>
                      <el-radio value="维修" size="large" class="smallOptions"><span style="font-size: 15px;">维修</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--是否补齐 - 18-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Completion_18">
                      <el-radio value="是" size="large" class="smallOptions"><span style="font-size: 15px;">是</span>
                      </el-radio>
                      <el-radio value="否" size="large" class="smallOptions"><span style="font-size: 15px;">否</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
              </el-row>
              <!-- 19-20 -->
              <el-row>
                <el-col :span="4">
                  <div class="grid-content ep-bg-purple"/>
                  <!--零件名称 - 19-->
                  <span>{{form4.input_Part_name_19}}</span>
                </el-col>
                <el-col :span="2">
                  <div class="grid-content ep-bg-purple"/>
                  <!--损坏现象 - 19-->
                  <span>{{form4.input_Damage_19}}</span>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--处理方式 - 19-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Processing_19">
                      <el-radio value="更换" size="large" class="smallOptions"><span style="font-size: 15px;">更换</span>
                      </el-radio>
                      <el-radio value="维修" size="large" class="smallOptions"><span style="font-size: 15px;">维修</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--是否补齐 - 19-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Completion_19">
                      <el-radio value="是" size="large" class="smallOptions"><span style="font-size: 15px;">是</span>
                      </el-radio>
                      <el-radio value="否" size="large" class="smallOptions"><span style="font-size: 15px;">否</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="4">
                  <div class="grid-content ep-bg-purple"/>
                  <!--零件名称 - 20-->
                  <span>{{form4.input_Part_name_20}}</span>
                </el-col>
                <el-col :span="2">
                  <div class="grid-content ep-bg-purple"/>
                  <!--损坏现象 - 20-->
                  <span>{{form4.input_Damage_20}}</span>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--处理方式 - 20-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Processing_20">
                      <el-radio value="更换" size="large" class="smallOptions"><span style="font-size: 15px;">更换</span>
                      </el-radio>
                      <el-radio value="维修" size="large" class="smallOptions"><span style="font-size: 15px;">维修</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
                <el-col :span="3">
                  <div class="grid-content ep-bg-purple"/>
                  <!--是否补齐 - 20-->
                  <div class="mb-2 ml-4">
                    <el-radio-group v-model="form4.radio_Completion_20">
                      <el-radio value="是" size="large" class="smallOptions"><span style="font-size: 15px;">是</span>
                      </el-radio>
                      <el-radio value="否" size="large" class="smallOptions"><span style="font-size: 15px;">否</span>
                      </el-radio>
                    </el-radio-group>
                  </div>
                </el-col>
              </el-row>
            </el-col>
          </el-row>
        </el-main>
      </el-container>
    </div>
  </el-form>
</template>

<script setup lang="ts">
import {defineProps, reactive, watch} from 'vue'
import axios from "axios";
import {ElMessage} from "element-plus";
const form4 = reactive({
  input_Judging_people:'',/*质量严损判断人员*/
  input_Date:'',/*质量严损判断日期*/
  input_Case:'',/*Case*/

  input_Part_name_1:'',/*零件名称 - 1*/
  input_Damage_1:'',/*损坏现象 - 1*/
  radio_Processing_1:'',/*处理方式 - 1*/
  radio_Completion_1:'',/*是否补齐 - 1*/

  input_Part_name_2:'',/*零件名称 - 2*/
  input_Damage_2:'',/*损坏现象 - 2*/
  radio_Processing_2:'',/*处理方式 - 2*/
  radio_Completion_2:'',/*是否补齐 - 2*/

  input_Part_name_3:'',/*零件名称 - 3*/
  input_Damage_3:'',/*损坏现象 - 3*/
  radio_Processing_3:'',/*处理方式 - 3*/
  radio_Completion_3:'',/*是否补齐 - 3*/

  input_Part_name_4:'',/*零件名称 - 4*/
  input_Damage_4:'',/*损坏现象 - 4*/
  radio_Processing_4:'',/*处理方式 - 4*/
  radio_Completion_4:'',/*是否补齐 - 4*/

  input_Part_name_5:'',/*零件名称 - 5*/
  input_Damage_5:'',/*损坏现象 - 5*/
  radio_Processing_5:'',/*处理方式 - 5*/
  radio_Completion_5:'',/*是否补齐 - 5*/

  input_Part_name_6:'',/*零件名称 - 6*/
  input_Damage_6:'',/*损坏现象 - 6*/
  radio_Processing_6:'',/*处理方式 - 6*/
  radio_Completion_6:'',/*是否补齐 - 6*/

  input_Part_name_7:'',/*零件名称 - 7*/
  input_Damage_7:'',/*损坏现象 - 7*/
  radio_Processing_7:'',/*处理方式 - 7*/
  radio_Completion_7:'',/*是否补齐 - 7*/

  input_Part_name_8:'',/*零件名称 - 8*/
  input_Damage_8:'',/*损坏现象 - 8*/
  radio_Processing_8:'',/*处理方式 - 8*/
  radio_Completion_8:'',/*是否补齐 - 8*/

  input_Part_name_9:'',/*零件名称 - 9*/
  input_Damage_9:'',/*损坏现象 - 9*/
  radio_Processing_9:'',/*处理方式 - 9*/
  radio_Completion_9:'',/*是否补齐 - 9*/

  input_Part_name_10:'',/*零件名称 - 10*/
  input_Damage_10:'',/*损坏现象 - 10*/
  radio_Processing_10:'',/*处理方式 - 10*/
  radio_Completion_10:'',/*是否补齐 - 10*/

  input_Part_name_11:'',/*零件名称 - 11*/
  input_Damage_11:'',/*损坏现象 - 11*/
  radio_Processing_11:'',/*处理方式 - 11*/
  radio_Completion_11:'',/*是否补齐 - 11*/

  input_Part_name_12:'',/*零件名称 - 12*/
  input_Damage_12:'',/*损坏现象 - 12*/
  radio_Processing_12:'',/*处理方式 - 12*/
  radio_Completion_12:'',/*是否补齐 - 12*/

  input_Part_name_13:'',/*零件名称 - 13*/
  input_Damage_13:'',/*损坏现象 - 13*/
  radio_Processing_13:'',/*处理方式 - 13*/
  radio_Completion_13:'',/*是否补齐 - 13*/

  input_Part_name_14:'',/*零件名称 - 114*/
  input_Damage_14:'',/*损坏现象 - 4*/
  radio_Processing_14:'',/*处理方式 - 14*/
  radio_Completion_14:'',/*是否补齐 - 14*/

  input_Part_name_15:'',/*零件名称 - 15*/
  input_Damage_15:'',/*损坏现象 - 15*/
  radio_Processing_15:'',/*处理方式 - 15*/
  radio_Completion_15:'',/*是否补齐 - 15*/

  input_Part_name_16:'',/*零件名称 - 16*/
  input_Damage_16:'',/*损坏现象 - 16*/
  radio_Processing_16:'',/*处理方式 - 16*/
  radio_Completion_16:'',/*是否补齐 - 16*/

  input_Part_name_17:'',/*零件名称 - 17*/
  input_Damage_17:'',/*损坏现象 - 17*/
  radio_Processing_17:'',/*处理方式 - 17*/
  radio_Completion_17:'',/*是否补齐 - 17*/

  input_Part_name_18:'',/*零件名称 - 18*/
  input_Damage_18:'',/*损坏现象 - 18*/
  radio_Processing_18:'',/*处理方式 - 18*/
  radio_Completion_18:'',/*是否补齐 - 18*/

  input_Part_name_19:'',/*零件名称 - 19*/
  input_Damage_19:'',/*损坏现象 - 19*/
  radio_Processing_19:'',/*处理方式 - 19*/
  radio_Completion_19:'',/*是否补齐 - 19*/

  input_Part_name_20:'',/*零件名称 - 20*/
  input_Damage_20:'',/*损坏现象 - 20*/
  radio_Processing_20:'',/*处理方式 - 20*/
  radio_Completion_20:'',/*是否补齐 - 20*/
})
const props = defineProps({
  input_Case: {
    type: String,
    default: ''
  }
})
watch(() => props.input_Case, (newValue) => {
  axios.get('http://192.168.110.84:8081/part4/value/' + newValue)
      .then(response => {
        // 处理响应
        const data = response.data.data;
        if (response.data.code === 1) {
          if(data !== null){
          // 遍历data对象并更新form
          Object.keys(data).forEach(key => {
            form4[key] = data[key];
          });}else {
            resetForm();
          }
        } else {
          ElMessage.error(response.data.message)
        }
      });
})
function resetForm() {
  form4.input_Judging_people = ''; /* 质量严损判断人员 */
  form4.input_Date = ''; /* 质量严损判断日期 */
  form4.input_Case = ''; /* Case */

  // 初始化零件相关的属性
  for (let i = 1; i <= 20; i++) {
    form4[`input_Part_name_${i}`] = ''; /* 零件名称 */
    form4[`input_Damage_${i}`] = ''; /* 损坏现象 */
    form4[`radio_Processing_${i}`] = ''; /* 处理方式 */
    form4[`radio_Completion_${i}`] = ''; /* 是否补齐 */
  }
}
</script>

<style scoped>
.el-col {
  border: black 1px solid;
}

.text_is_vertical {
  writing-mode: vertical-lr; /* 从上到下竖直排列文字 */
  text-orientation: mixed; /* 保持字符的原始方向 */
}

.fontSize {
  font-size: 20px;
}

.smallOptions {
  height: 20px;
}

.text_is_on_the_left {
  text-align: left;
}
.the_font_is_bold {
  font-weight: bold;
}
.report-header {
  text-align: center;
}
.title-container {
  display: inline-block;
  text-align: center;
}
</style>